import React from 'react';
import { View, Text } from '@tarojs/components';
import './index.scss';

//kind: 1退款 2退货 3换货
const Info = ({ detail = {}, isResult = false, className = '' }) => {
  const { id, created, kind, reason, orderId, name, mobile, refundAddress } = detail;
  let reasonObj = JSON.parse(reason);
  return (
    <View className={'Info txt24 box2 ' + className}>
      <View>
        <Text className="black05 label">服务单号</Text>
        <Text className="black085">{id}</Text>
      </View>
      <View className="mt16">
        <Text className="black05 label">申请时间</Text>
        <Text className="black085">{created}</Text>
      </View>
      <View className="mt16">
        <Text className="black05 label">服务类型</Text>
        <Text className="black085">{kind == 1 ? '退款' : kind == 2 ? '退货' : '换货'}</Text>
      </View>
      <View className="mt16">
        <Text className="black05 label">申请原因</Text>
        <Text className="black085">{reasonObj?.value}</Text>
      </View>
      <View className="mt16">
        <Text className="black05 label">订单编号</Text>
        <Text className="black085">{orderId}</Text>
      </View>
      {(kind == 1 || kind == 2) && (
        <View className="mt16">
          <Text className="black05 label">退款方式</Text>
          <Text className="black085">原路退回</Text>
        </View>
      )}
      {!isResult && (
        <>
          {(kind == 2 || kind == 3) && (
            <View className="mt16">
              <Text className="black05 label">商品退回</Text>
              <Text className="black085">自行寄出</Text>
            </View>
          )}
          {kind == 3 && (
            <View className="mt16">
              <Text className="black05 label">收货人</Text>
              <Text className="black085">{name}</Text>
              <Text className="black085 mobile">{mobile}</Text>
            </View>
          )}
          {kind == 3 && (
            <View className="mt16 flex-row">
              <Text className="black05 label">收货地址</Text>
              <View className="black085 txtDotMultiLine line2">{refundAddress}</View>
            </View>
          )}
        </>
      )}
    </View>
  );
};

export default Info;
